import NavLink from 'umi/navlink';
import withBreadcrumbs from 'react-router-breadcrumbs-hoc';
import { Breadcrumb } from 'antd';
import styles from './Breakcrumbs.less';

const routes = [
  { path: '/', breadcrumb: '短信平台' },
  { path: '/sms', breadcrumb: '短信' },
  { path: '/sms/sendSms', breadcrumb: '短信发送' },
  { path: '/sms/smsRecord', breadcrumb: '我的短信发送记录' },
  { path: '/sms/smsRecordAdmin', breadcrumb: '全部短信发送记录' },
  { path: '/telbook', breadcrumb: '电话簿' },
  { path: '/telbook/personal', breadcrumb: '个人电话簿' },
  { path: '/telbook/enterprise', breadcrumb: '企业电话簿' },
  { path: '/auth', breadcrumb: '用户' },
  { path: '/auth/userManager', breadcrumb: '用户管理' },
  { path: '/auth/roleManager', breadcrumb: '角色管理' },
  { path: '/system', breadcrumb: '设置' },
  { path: '/system/keyt', breadcrumb: '短信签名' },
  { path: '/system/setting', breadcrumb: '系统设置' },
];

function makeBreadcrumb(breadcrumb){
    let url = breadcrumb.props.match.url
    switch(url){
        case '/user': url = '/'
        case '/sms': url = '/'
        case '/telbook': url = '/'
        case '/auth': url = '/'
        case '/system': url = '/'
    }
    return(
        <NavLink to={url}>
            {breadcrumb}
        </NavLink>
    )
}

export default withBreadcrumbs(routes)(({ breadcrumbs }) => (
  <div className = {styles.box}>
    <Breadcrumb>
        {breadcrumbs.map((breadcrumb, index) => (
            <Breadcrumb.Item key={index}>
                <span key={breadcrumb.key}>
                    {makeBreadcrumb(breadcrumb)}
                </span>
            </Breadcrumb.Item>
        ))}
    </Breadcrumb>
  </div>
));